Widget de zone de mouvement
Chemin : Galerie des widgets > Boutons > Autres
Le widget de zone de mouvement est un bouton à zone réactive qui génère des événements gestuels.
| Événements gestuels | Description |
|---|---|
|
BalayageGauche BalayageDroite |
Un événement est déclenché lorsqu'un geste de balayage (swipe) est détecté |
|
PincementOuvert PincementFermé |
Un événement est déclenché lorsqu'un geste de pincement (pinch) est détecté |
|
RotationSensHoraire RotationSensAntihoraire |
Un événement est déclenché lorsqu'un geste de rotation est détecté |
|
OnPan (Panoramique) OnPinch (Pincement) OnRotate (Rotation) |
Une série d'événements déclenchés pendant le geste. Seul JavaScript peut être utilisé pour gérer ces événements, grâce au code JavaScript, le développeur peut gérer les événements des gestes comme il le souhaite. AVERTISSEMENT : Seuls les périphériques IHM multi-touches peuvent générer des événements OnPinch et OnRotate |
OnPan (Panoramique)
boolean onGesturePan(me, eventInfo)
Cet événement se produit lorsqu’un point à l'intérieur de la zone a été appuyé et qu’un mouvement a été détecté.
| Paramètre | Description |
|---|---|
| me | Objet déclencheur de l'événement. |
| eventInfo |
id = ID Geste ; utilisé pour identifier les différents gestes. running = Vrai, sauf pour le dernier événement livré pour informer l’achèvement du geste. dx = Total de mouvements de l'axe X en unités de pixels de l'écran depuis la position initiale de contact. dy = Total de mouvements de l'axe Y en unités de pixels de l'écran depuis la position initiale de contact. |
OnPinch (Pincement)
boolean onGesturePinch(me, eventInfo)
Cet événement se produit lorsque 2 points à l'intérieur de la zone ont été appuyés et qu’un mouvement a été détecté.
| Paramètre | Description |
|---|---|
| me | Objet déclencheur de l'événement |
| eventInfo |
id = ID Geste ; utilisé pour identifier les différents gestes. running = Vrai, sauf pour le dernier événement livré pour informer l’achèvement du geste. dx = Total de mouvements de l'axe X en unités de pixels de l'écran depuis la position initiale de contact. La valeur positive signifie que la distance augmente ; La valeur négative signifie que la distance diminue. Cette quantité peut être utilisée pour contrôler une valeur de zoom. dy = Total de mouvements de l'axe Y en unités de pixels (voir dx). |
OnRotate (Rotation)
boolean onGestureRotate(me, eventInfo)
Cet événement se produit lorsque 2 points à l'intérieur de la zone ont été appuyés et qu’un mouvement de rotation a été détecté.
| Paramètre | Description |
|---|---|
| me | Objet déclencheur de l'événement |
| eventInfo |
id = ID Geste ; utilisé pour identifier les différents gestes. running = Vrai, sauf pour le dernier événement livré pour informer l’achèvement du geste. drot = combien de degrés (0/360) ont été ajoutés depuis le dernier événement. trot = nombre total de degrés (0/360) du mouvement en entier. Les nombres positifs signifient une rotation dans le sens horaire, les nombres négatifs signifient une rotation dans le sens antihoraire. |
Transit d'événements gestuels
Pour utiliser un widget (par exemple un bouton ou un curseur) recouvert d'un objet gestuel, vous devez maintenir enfoncé le widget 200 ms pour déplacer la commande vers l'objet sous-jacent. Le temps d'attente pour envoyer la commande vers l'objet sous-jacent peut être modifié à partir du paramètre « Délai de transit de geste » disponible dans la vue des propriétés avancées.
| Paramètre | Description | ||||
|---|---|---|---|---|---|
| Transit de mouvement activé |
Active la possibilité de passer des événements gestuels aux widgets sous-jacents après un délai configurable. L'utilisateur doit maintenir le doigt appuyé puis exécuter le geste. défaut = utilise la valeur définie dans les propriétés du projet. Voir "Projet" vrai = transit de mouvement activé faux = transit de mouvement désactivé |
||||
| Délai de transit de geste (ms) |
Le temps qu'il faut attendre pour envoyer la commande à l'objet sous-jacent
|
Exemples d'utilisation d'événements gestuels en association avec JavaScript
Ici figurent quelques exemples de l'utilisation d'événements en association avec le code JavaScript pour identifier les gestes et programmer les actions demandées.
Geste de balayage
Comment reconnaître un geste de « balayage » de changement de page dans l'application.
- Mettez un widget de zone de Gestion dans la page
- Configurer l'action OnPan pour déclencher une fonction JavaScript
- Écrire le code JavaScript qui reconnait et gère le geste de balayage
.png)
Geste de pincement
Comment reconnaître un geste de « pincement » pour redimensionner une image.
- Placer un widget de zone de Geste dans la page sur l'image
- Configurer l'action OnPinch pour déclencher une fonction JavaScript
- Écrire le code JavaScript qui reconnait et gère le geste de pincement
.png)
Geste panoramique
Comment reconnaître un geste « panoramique » pour déplacer une image.
- Placer un widget de zone de Geste dans la page sur l'image
- Configurer l'action OnPan pour déclencher une fonction JavaScript
- Écrire le code JavaScript qui reconnait et gère le geste panoramique
.png)